<template>
  <div>
  	 <x-header>{{instance.subject}}<router-link to="/"  slot="right"> <a class="fa fa-home fa-15x"></a> </router-link></x-header>
  	 	<div class="formBox gzbank-style">
		   <div v-if="form.type=='INNER'">
			<ab-custom-form></ab-custom-form>
	   </div> 
	    <div v-if="form.type=='FRAME'">
        	<ab-url-form  ref="urlForm" :form="form" ></ab-url-form>
       </div>
		   </div>
	   <bpm-buttons :buttons="buttons" class="gzbank-style"></bpm-buttons>
	   <div v-if="dynamicComponent.show"  :is="dynamicComponent.key" @cancel="dynamicComponent.show=false" @callback="dynamicComponent.callback" :show-dialog="dynamicComponent.show" :passConf="dynamicComponent.flowParam"></div>
  </div>
</template>

<script>
import Vue from 'vue'
import bpmService from '@/service/bpm/bpmService'
import formService from '@/service/form/formService'

export default {
  name: 'abCheckbox',
  methods: {
    
  },
  data :function () {
	    return {
	      instance:"",
	      form:"",
	      buttons:"",
	      flowRequestParam:{}, // 最终提交的数据
		  configSpecified:{},	// 流程配置信息
	      dynamicComponent:{
	    	  key:"opinion-dialog",
	    	  show:false
	      }
	    }
	},
  created : function(){
  	this.instanceId = this.$route.query.instanceId;
  	this.nodeId = this.$route.query.nodeId;
  	this.carbonId =  this.$route.query.carbonId;
  	var thisVue = this;
  	bpmService.init({instanceId:this.instanceId,formType:"mobile",readonly:true,nodeId:this.nodeId,carbonId :this.carbonId},function(data){
  		formService.initCustFormFu(data.form.formHtml,data);
		thisVue.form = data.form;
		thisVue.buttons = data.buttonList;
		thisVue.instance = data.instance;
		thisVue.flowRequestParam = data.flowRequestParam;
		thisVue.configSpecified = data.configSpecified;
	});
  }
  
}
</script>

<style scoped>

</style>
